<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>矿热炉的信息感知与实时传输系统</title>
</head>
<body>
<head>
<link rel="stylesheet" type="text/css"
	href="http://www.java1234.com/jquery-easyui-1.3.3/themes/default/easyui.css">
<link rel="stylesheet" type="text/css"
	href="http://www.java1234.com/jquery-easyui-1.3.3/themes/icon.css">
<link rel="stylesheet" type="text/css"
	href="http://www.java1234.com/jquery-easyui-1.3.3/demo/demo.css">
<script src="http://www.java1234.com/jquery-easyui-1.3.3/jquery.min.js"></script>
<script
	src="http://www.java1234.com/jquery-easyui-1.3.3/jquery.easyui.min.js"></script>
<script
	src="http://www.java1234.com/jquery-easyui-1.3.3/locale/easyui-lang-zh_CN.js"></script>
<script src='http://www.ichartjs.com/ichart.latest.min.js'></script>
<script src='js/ichart.1.1.min.js'></script>
<script src='js/chart.js'></script>
<!-- jquery代码 -->
<script type="text/javascript">
var nodeId = '1_1_1';	
InterTime = 10000;
var timer = setInterval("flushChart()", InterTime); //间隔时间调用flushChart()函数。单位ms。

flushChart();
$(document).ready(function() {
	dataflow = [];
	labflow = [];
	timeflow = [];
	chartdata = null;
	$('#tt').tree({
		onClick : function(node) {//对树状结构进行单击二级菜单改变东部布局，三级菜单改变中原布局
			if(node.id.length>3){//中原布局
				nodeId = node.id;		
				flushChart();
			}else{
				var a = node.id.split('_');
				//单击二级菜单改变表格的请求源。成功。
				$('#tb').datagrid({url:'WebTableJson?DAQ_Id='+a[1]});
			}
		}
	});
	
});
</script>
</head>
<body>
	<h2 style="font-size: 24px; text-align: center">晓明研究室数据采集及监控系统</h2>
	<div style="margin: 10px 0;"></div>
	<div id="layoutbody" align="center">
		<div class="easyui-layout" style="width: 1200px; height: 800px;">

			<!-- 西方布局 -->
			<div data-options="region:'west',split:true,title:'设备信息'"
				style="width: 100px;">
				<!-- 树形结构 -->
				<ul id="tt" class="easyui-tree"
					data-options="url:'WebTreeJson'"></ul>
			</div>

			<!-- 东方布局 -->
			<div data-options="region:'east',split:true,title:'数据项'"
				style="width: 200px;">
				<!-- 表格 -->
				<table id="tb" class="easyui-datagrid" 
					style="width: 700px;"
					data-options="singleSelect:true,collapsible:true,url:'WebTableJson?DAQ_Id=1'">
					<thead>
						<tr>
							<th data-options="field:'Name',width:80">数据源</th>
							<th data-options="field:'Value',width:80">数值</th>
						</tr>
					</thead>
				</table>
			</div>

			<!-- 中原布局 -->
			<div data-options="region:'center',title:'主面板',iconCls:'icon-ok'"
				style="padding: 1px">
				<!-- 选项卡 -->
				<div class="easyui-tabs"
					style="width: 900px; height: auto, text-align:center; margin-left: auto; margin-right: auto;">
					<div title="数据图表" style="padding: 10px">
						
						<div align="center" style="padding: 10px">
							<form name="form1" align="center" method="post" action="">
	  						刷新间隔 (ms)<input name="input1" type="text" id="input1">
		  					<input type="button" name="Submit" value="更改" onClick="changeInterval(input1)">
							</form>
						</div>
						<div id='canvasDiv' align="center" style="padding: 10px">请选择通道</div>
					</div>
					<div title="远程监控" style="padding: 10px">
					<!-- 视频监控用的是研究室的网络ip -->
						<div align="center"><img src="http://219.226.90.30:8080/?action=stream" alt="实时数据" width="640" height="480" /></div>
					</div>
					<div title="帮助" data-options="iconCls:'icon-help',closable:true"
						style="padding: 10px">这是帮助内容.</div>
				</div>
			</div>
		</div>
	</div>
	<div id="footer" style='text-align:center'>
		<table width="50%" border="0" align="center" cellpadding="0"
			cellspacing="0" style="padding: 10px">
			<tbody>
				<tr align="center">
					<td><a
						href="http://www.xiaoming-lab.com/index-yan-jiu-shi.htm"
						target="_blank">研究室介绍</a></td>
					<td>|</td>
					<td><a
						href="http://www.xiaoming-lab.com/temp/yanjiushi-logon.asp"
						target="_blank">成员之家</a></td>
					<td>|</td>
					<td><a
						href="http://www.xiaoming-lab.com/index-ke-wai-yan-fa.htm"
						target="_blank">课外研发</a></td>
					<td>|</td>
					<td><a
						href="http://www.xiaoming-lab.com/04%20teching/teching-logon.asp"
						target="_blank">本科教学</a></td>
					<td>|</td>
					<td><a
						href="http://www.xiaoming-lab.com/index-zi-yuan-zhong-xi.htm"
						target="_blank">资源中心</a></td>
					<td>|</td>
					<td><a
						href="http://www.xiaoming-lab.com/index-lian-xi-wo-men.htm"
						target="_blank">联系我们</a></td>
				</tr>
			</tbody>
		</table>
		
		<p>
			<a href="http://www.xiaoming-lab.com/temp/yanjiushi-logon1.asp"
				target="_blank">Copyright @ 2014 All rights reserved. 晓明研究室 版权所有</a>
		</p>
		<p>制作人：韦啸 田彦博 段明江</p>
	</div>
</body>
</html>
